<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
	<title>好友</title>
	<link rel="stylesheet" type="text/css" href="../../css/aui-win.css" />
<style>
.searchDiv img {
	width:20px;
	height:20px;
	position: absolute;
	right: 8%;
	top: 78px;
}
.searchDiv input[type="text"] {
	margin-top: 25px;
	width: 90%;
	margin-left: 2.5%;
	height: 36px;
	border-radius: 36px;
	border: 1px solid dimgray;
	padding-left: 5%;
	z-index: 10;
	color: #B3B3B3;
}
#search {
	width: 20px;
	height: 20px;
	background: url('../../image/home/busess/search.png');
	position: absolute;
	right: 7.5%;
	top: 38px;
	border: 1px solid #00ABFD;
}
a {
	text-decoration: none;
}
/*设置内容区样式*/
body {
	min-width: 320px;
}
#news {
	background-color: #f2f2f2;
}
#news ul li {
	overflow: hidden;
	border-bottom: 1px solid white;
}
#news ul li a {
	display: block;
	overflow: hidden;
	position: relative;
	padding: 10px 10px;
}
#news ul li a.active {
	background-color: #d9e4e9;
}
#news ul li img {
	float: left;
	width: 90px;
	height: 90px;
	border-radius: 4px;
}
#news .content {
	width: 65%;
	margin-left: 100px;
	overflow: hidden;
}
#news .content h2, #news h2 {
	font-size: 16px;
	font-weight: 800;
	margin-bottom: 6px;
	color:black;
}
#news .content p {
	width: 100%;
	color: #999;
	height: 50px;
	overflow: hidden;
	font-size: 14px;
	line-height: 2;
	word-wrap: break-word;
}

#txtNewsList {
	margin-top: 20px;
}
.defaltes {
	width: 95%;
	margin-left: 2.5%;
	background: #D9D9D9;
	height: 300px;
	text-align:center;
}
.defaltes span{
	margin-top:140px;
	font-size: 20px;
	display: block;
}
.warnDiv{
	width: 95%;
	margin-left: 2.5%;
	background: #D9D9D9;
	height: 300px;
	text-align:center;
}
.warnDiv span{
	margin-top:140px;
	font-size: 20px;
}
input.btn {
	width: 95%;
	border: 1px solid #4390af;
	border-radius: 6px;
	background-color: #00abfd;
	padding: 10px 0;
	display: block;
	margin: 0 10px;
	font-size: 16px;
	color: #fff;
	text-align: center;
}
.butclass {
	width: 95%;
	margin-left: 2.5%;
	height: 50px;
	margin-top: 5px;
}
.yuandian{
	width:7px;
	height:7px;
	border-radius:7px;
	background:red;
	position:absolute;
	right:3%;
	top:10px;
	display:none;
}
</style>
</head>
<body style="background:#f9f9f9;">
	<div id="tanChu1">
		<p>数据请求失败！</p>
		<input type="button" value="确定" id="tanChu_btn1">
	</div>
    <div class="div_loding_img">
		数据加载中
	</div>
<header class="aui-bar aui-bar-nav aui-bar-yunzo" id="aui-header">
		<a class="aui-btn aui-bar-yunzo aui-pull-left" id="back"> <span class="aui-iconfont aui-icon-left"></span></a>
		<div class="aui-title" id="title">
			好友
		</div>
		<a class="aui-iconfont aui-icon-menu aui-pull-right" id="newfriends">新的好友</a>
		 <div class="yuandian"></div>
	</header>
	<div class="margin_div"></div>
	<div class="searchDiv">
		<img src="../../image/home/busess/search.png" onclick="fuzzySearch()">
		<input type="text" placeholder="请输入要查找的姓名" id="fuzzyText">
	</div>
	<div id="news">
		<ul id="txtNewsList"></ul>
	</div>
<script src="../../script/jquery-1.10.2.min.js"></script>
<script src="../../script/common.js"></script>
<script type="text/javascript">

//显示数据条数
var pagesize = 5;
//当前数量
var curCount = 0;
var obj;
$(document).ready(function(){
	sTart_Stop();
	goback("../main.html");
	obj = $('#txtNewsList');
	var Post =basedata('gcotactsinfo')+"&pagesize="+pagesize+"&curCount="+curCount;
	ajaxcocRequest('../../../api/account/getmemberfriendsinfolist', 'post', Post, function(msg){
		obj.html("");
		if(msg.code ==100){
				var html = '';
				if (msg.data.length>0) {
					for (var i = 0; i < msg['data'].length; i++) {
						var thisItem = msg['data'][i];
						html += '<li><a tapmode="active" onclick="openNews(\'' + thisItem.n1 + '\');"><div class="logo"><img src="' + thisItem.n3+ '"/></div><div class="content"><h2 class="title">' + thisItem.n2+ '</h2><p>' + thisItem.n4 + '</p></div> </a></li>';
					}
				} else {
					obj.html("<div style='width:20%;margin:40px 0 0 40%;'><img src='../../image/gantan.png' style='width:100%;'></div><p style='width:100%;text-align:center;margin-top:30px;color:#999;font-size:18px;'>还未添加任何好友！</p>");
				}
				obj.append(html);
			}else{

				$("body").append('<div class="wuwang"><img src="../../image/iconfont-wangluo.png"><p>网络拥堵，信息塞车</p></div>')
			}
	});
});

//点击进行模糊查询
function fuzzySearch(){
	var likevalue=$('#fuzzyText').val();
	var bodyParam = {"mid":$mid,"groupid":$groupid,"did":initdata.get('gcotactsinfo'),"type":0,"pagesize":pagesize,"curcount":curCount,"likevalue":likevalue};
	ajaxCoCRequest('../../../api/account/queryMemberFriendsinfoBylavalue', 'POST', bodyParam, function(msg) {
		obj.html("");
		$('#fuzzyText').val("");
		if(msg.code==100)
		{
			if(msg.data.length>0)
			{
				var html = '';
				for (var i = 0; i < msg['data'].length; i++) {
					var thisItem = msg['data'][i];
					html += '<li><a tapmode="active" onclick="openNews(\'' + thisItem.n1 + '\');"><div class="logo"><img src="' + thisItem.n3+ '"/></div><div class="content"><h2 class="title">' + thisItem.n2 + '</h2><p>' + thisItem.n4+ '</p></div> </a></li>'
				}
				obj.append(html);
			}else
			{
				obj.append('<div class="defaltes"><span>返回通讯录添加好友！</span></div>');
			}
		}else if(msg.code==505)
		{
			obj.append('<div class="defaltes"><span>返回通讯录添加好友！</span></div>');
		}else
		{
			$("body").append('<div class="wuwang"><img src="../../image/iconfont-wangluo.png"><p>网络拥堵，信息塞车</p></div>')
		}
		
	});
}
function openNews(infoid)
{	
	window.location='selfinfo.html'+'?infoid='+infoid;
}

$('#newfriends').click(function(){
	window.location='addmycontacts_list.html';
})
</script>
</body>
</html>